<template>
    <!-- 一类有children,递归调用自身 -->
    <el-sub-menu v-if="item.children" :index="item.path">
        <template #title>
            <span>{{ item.meta.title }}</span>
        </template>
        <!-- 处理children  -->
        <GAsideMenu v-for="it in item.children" :item="it" />
    </el-sub-menu>
    <el-menu-item v-else :index="item.path">
        <span>{{ item.meta.title }}</span>
    </el-menu-item>

    <!-- 一类没有children,直接输出 -->
</template>

<script lang="ts">
interface Menu {
    item: {
        meta: {
            title?: string;
        };
        path: string;
        children?: Menu[]
    }
}
export default {
    name: 'GAsideMenu'
}
</script>
<script lang="ts" setup >
defineProps<Menu>();
</script>